<!--
  Generated template for the ChatPage page.

  See http://ionicframework.com/docs/components/#navigation for more info on
  Ionic pages and navigation.
-->
<ion-header no-border (tap)="tapEvent($event)" [class.idark]="isIdark">

    <ion-navbar color="mblue">
        <ion-title>{{targetName}}</ion-title>
    </ion-navbar>

</ion-header>


<ion-content [class.idark_content]="isIdark">
    <div class="message-wrap">

        <div *ngFor="let msg of msgList" class="message" [class.left]=" msg['targetId'] != '' " [class.right]=" msg['targetId'] == ''">
            <img class="user-img" alt="" src="https://avatars2.githubusercontent.com/u/11835988?v=3&u=2a181779eb2164666606366a1df31f9c17cf7a20&s=100" />

            <div class="msg-detail">
                <div class="msg-info">
                    <p>{{msg.sentTime | date}}</p>
                </div>
                <div class="msg-content">
                    <span class="triangle"></span>
                    <p class="line-breaker ">{{msg['content']['content']}}</p>
                </div>
            </div>
        </div>

    </div>

</ion-content>

<ion-footer no-border [class.idark]="isIdark">
    <ion-grid class="input-wrap">
        <ion-row>

            <ion-col col-10>
                <ion-textarea #chat_input placeholder="说点什么..." [(ngModel)]="editorMsg" (keyup.enter)="sendMsg()" (focus)="scrollToBottom()"></ion-textarea>
            </ion-col>
            <ion-col col-2>
                <button ion-button clear icon-only item-right (click)="sendMsg()">
          <ion-icon  name="ios-send" ios="ios-send" md="md-send"></ion-icon>
        </button>
            </ion-col>
        </ion-row>
    </ion-grid>
</ion-footer>